<template>
  <div>
    <el-card class="box-card">
      <search
        :searchProps="searchProps"
        @change="searchChange"
        @search="getList"
        v-if="isSearch"
      ></search>
      <labor @displaySearch="displaySearch" @addChange="addChange"></labor>
      <myTable
        :loading="loading"
        :tableList="tableList"
        :page="params.page"
        :page_size="params.page_size"
        :total="total"
        @stateChange="stateChange"
        @currentChange="currentChange"
        @sizeChange="sizeChange"
        @detail="detailChange"
        @send="send"
      ></myTable>
    </el-card>
    <detail ref="detail"></detail>
    <!-- <my-form ref="form" @refresh="getList"></my-form> -->
  </div>
</template>

<script>
import searchProps from "./table/search/searchProps"
import labor from "./table/labor"
import myTable from "./table"
import detail from "./form/detail"
// import myForm from "./form"
import { list, sendWater } from "@/api/behalf"
export default {
  components: { myTable, labor, detail },
  data() {
    return {
      loading: true,
      isSearch: false,
      tableList: [],
      params: {
        page: 1,
        page_size: 10,
        order_number: "",
        spread_id: "",
        behalf_status: "",
        start_time: "",
        end_time: "",
      },
      total: 0,
      searchProps: searchProps,
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    async getList() {
      try {
        const { data } = await list(this.params)
        this.loading = false
        this.tableList = data.data
        this.total = data.total
      } catch (ex) {
        this.loading = false
        this.$msg.errorMsg(ex.msg)
      }
    },
    // 添加/修改
    addChange(type = 1, e) {
      this.$refs.form.show(type, e)
    },
    // 详情
    detailChange(e) {
      this.$refs.detail.show(e)
    },
    // 发聚水潭
    async send({ id }) {
      try {
        const data = await sendWater({ behalf_id: id })
        this.$msg.successMsg(data.msg)
        this.getList()
      } catch (ex) {
        console.log(ex)
      }
    },
    // 更改状态
    stateChange({ state }) {
      console.log(state)
    },
    // 分页
    sizeChange(e) {
      this.params.page_size = e
      this.getList()
    },
    currentChange(e) {
      this.params.page = e
      this.getList()
    },
    // 是否显示搜索
    displaySearch() {
      this.isSearch = !this.isSearch
    },
    // 搜素
    searchChange(e) {
      const { spread_id, order_number, behalf_status, start_time } = e
      this.params = {
        ...this.params, // 保留已有属性
        spread_id,
        order_number,
        behalf_status,
        start_time: start_time ? start_time[0] : "",
        end_time: start_time ? start_time[1] : "",
      }
    },
  },
}
</script>

<style lang="scss" scoped></style>
